// pages/make/index.js
const QRCode = require('../../utils/createQrcode');
const dateFormat=require('../../utils/util.js')

Page({

    /**
     * 页面的初始数据
     */
    data: {
        // 输入的数据
        createVal:'',
        // 输入框获取焦点
        focus:false,
        // 生成的二维码临时路径
        srcQR:'',

        // 显示canvas弹出框
        showCanvas: false,

        // 历史记录
        historyList: [],
    },

    // 页面加载
    onLoad(e){
        wx.getStorage({
            key: 'createQR',
            success :(res)=> {
                this.setData({
                    historyList:res.data || []
                })

            },
            complete:(res)=> {
                const {data} = e
                if (data){
                    this.setData({
                        createVal: decodeURIComponent(data)
                    })
                    this.createQR()
                }
            }
        })


    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow: function () {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide: function () {

    },

    // 输入框清空按钮
    nowClear(){
        this.setData({
            createVal:''
        })
    },

    // 输入框失去焦点
    inputOver(e){
        this.setData({
            focus: false
        })
    },

    // 输入框获取焦点
    inputFocus(){
        this.setData({
            focus: true
        })
    },

    // 输入框输入的时候
    input(e){
        this.setData({
            createVal:e.detail.value
        })
    },

    // 绘制二维码
    canvasQR(data){
        wx.showLoading({
            title: '生成中...',
        })
        new QRCode('myQrcode', {
            text: data,// 需要生成二维码的数据
            width: 1000,// 二维码的宽度
            height: 1000,// 二维码的高度
            padding: 5,
            correctLevel: QRCode.CorrectLevel.Q, // 二维码可辨识度,从低到高以此是M、L、H、Q
            callback: res =>{
                this.setData({
                    showCanvas:true,
                    srcQR:res.path
                })
                wx.hideLoading()
            }
        })
    },

    // 生成二维码
    createQR(){
        const time = Date.now()


        this.setData({
            historyList: [{
                time,
                date: dateFormat.dateFormat(time, 'yyyy-MM-dd hh:mm:ss'),
                content: this.data.createVal
            }].concat(this.data.historyList)
        })


        wx.setStorage({
            key:"createQR",
            data:this.data.historyList
        })


        this.canvasQR(this.data.createVal)



    },

    // 关闭canvas弹出框
    clearCanvas(){
        this.setData({
            showCanvas: false
        })
    },

    // 历史记录生成二维码
    historyCreateQR(e){
        this.canvasQR(e.currentTarget.dataset.data)
    },

    // 编辑
    itemEdit(e){
        const index = Number(e.currentTarget.dataset.index)
        this.setData({
            createVal:this.data.historyList[index].content,
            focus: true
        })
        wx.pageScrollTo({
            scrollTop:0
        })
    },

    // 删除
    itemClear(e){
        wx.showModal({
            title: '提示',
            content: '确认删除这一条记录？',
            success: (res)=> {
                if (res.cancel) return

                const index = Number(e.currentTarget.dataset.index)
                this.data.historyList.splice(index,1)

                this.setData({
                    historyList: this.data.historyList
                })
                wx.setStorage({
                    key:"createQR",
                    data:this.data.historyList
                })
            }
        })
    },

    // 清空历史记录
    clearAll(){
        wx.showModal({
            title: '提示',
            content: '确认清空全部历史记录？',
            success: (res)=> {
                if (res.cancel) return

                this.setData({
                    historyList:[],
                })
                wx.removeStorage({
                    key: 'createQR',
                })
            }
        })
    },

    // 分享
    onShareAppMessage(){
        return{
            imageUrl:"./../../assets/logo.png"
        }
    }
})
